import { getCartList, changCount, delSelect } from '@/api/cart'
import { Toast } from 'vant'

export default {
  namespaced: true,
  state () {
    return {
      cartList: []
    }
  },
  mutations: {
    setCartList (state, newList) {
      state.cartList = newList
    },
    // 复选框选择与取消选择功能
    changCheck (state, goodId) {
      const goods = state.cartList.find(item => item.goods_id === goodId)
      goods.isChecked = !goods.isChecked
    },
    // 全选功能
    // toggleAllCheck (state, flag) {
    //   state.cartList.forEach(item => {
    //     item.isChecked = flag
    //   })
    // },
    toggleAllCheck (state, flag) {
      // 让所有的小选框，同步设置
      state.cartList.forEach(item => {
        item.isChecked = flag
      })
    },
    changeCount (state, { goodsId, goodsNum }) {
      // 根据id找到cartList中的项 然后修改里面的商品数量
      const goods = state.cartList.find(item => item.goods_id === goodsId)
      goods.goods_num = goodsNum
    }

  },
  actions: {
    async getCartAction (context) {
      const { data } = await getCartList()
      // 后台返回的数据中,不包含复选框的选中状态，为了多现将来的功能
      // 需要手动维护数据，给每一项，添加一个 isChecked状态（标记当前商品是否选中)
      data.list.forEach(item => {
        item.isChecked = true
      })

      context.commit('setCartList', data.list)
    //   console.log(data)
    },
    async changeCountAction (context, obj) {
      const { goodsNum, goodsId, goodsSkuId } = obj
      // 先本地修改 再同步到后台服务器 (如果没有这步，先修改后台，前台不会马上改变,需要刷新)
      context.commit('changeCount', { goodsId, goodsNum })
      // 同步到后台
      await changCount(goodsId, goodsNum, goodsSkuId)
    //   console.log(res)
    },
    // 删除后台购物车数据
    async delAction (context) {
      // 拿到选中的商品项
      const selCartList = context.getters.selCartList
      // 拿到选择商品列表中的每一项的 id
      const cartIds = selCartList.map(item => item.id)
      console.log(cartIds)
      await delSelect(cartIds)
      Toast('删除成功')

      // 重新拉取最新的购物车数据更新到页面(重新渲染)
      context.dispatch('getCartAction')
    }

  },
  getters: {
    // 统计商品总个数
    carTotal (state) {
      return state.cartList.reduce((sum, item) => sum + item.goods_num, 0)
    },
    // 选中的商品项
    selCartList (state) {
      return state.cartList.filter(item => item.isChecked)
    },
    // 选中的总数
    selCount (state, getters) {
      return getters.selCartList.reduce((sum, item) => sum + item.goods_num, 0)
    },
    // 选中的总价
    selPrice (state, getters) {
      return getters.selCartList.reduce((sum, item) => {
        return sum + item.goods_num * item.goods.goods_price_min
      }, 0).toFixed(2)
    },
    // 复选框每一项都选择，全选按钮也选择
    isAllCheck (state) {
      return state.cartList.every(item => item.isChecked)
    }
  }
}
